$(function () {


  // 给 body 和 lt-top 添加过渡 
  $('body, .lt-top').css('transition', 'padding 0.5s');

  // 1-进度条功能 
  // 2- 二级分类 展开合并
  // 3- 侧边栏显示和隐藏 
  // 4- 退出功能 

  // 1-进度条功能 
  // 7- 进度条功能 - 提升用户体验  - 公共功能 

  // 使用假进度条 
  // 请求发送前进度条开始动画， 请求完成后，进度条结束动画； 

  // 进度条插件：   NProgress.js    
  // NProgress.start() 动画开始 
  // NProgress.done() 动画开始 

  // 同一个页面同时发送多个请求如何处理？ 答案： 共用一个进度条 
  // 进度条 什么时候： 
  //  开始动画: 第一个ajax请求发送时， 
  //  结束动画：页面所有ajax请求都结束

  // ajax全局事件，监听整个页面的 
  // 1. ajaxStart  在开始一个ajax请求时触发
  // 2. ajaxSend在beforeSend回调函数之后触发
  // 3. ajaxSuccess在success回调函数之后触发
  // 4. ajaxError在error回调函数之后触发
  // 5. ajaxComplete在complete回调函数之后触发
  // 6. ajaxStop在ajax请求结束时触发

  //  开始动画: 第一个ajax请求发送时，
  $(document).ajaxStart(function () {
    NProgress.start();
  });
  //  结束动画：页面所有ajax请求都结束
  $(document).ajaxStop(function () {
    setTimeout(function () {
      NProgress.done();
    }, 800)
  })
  // 不显示小圆圈
  NProgress.configure({ showSpinner: false });

  // 2- 二级分类 展开合并
  $('.cate-link').click(function () {
    $('.cate-two').stop().slideToggle();
  })

  // 3- 侧边栏显示和隐藏 
  // 点击菜单按钮，切换侧边栏
  // 1- lt-aside 切换 lt-out 类名 
  // 2- body 和 lt-top  切换pl-180类名  
  // 推荐把动画效果用css3来实现， 封装成类名， js只需切换类名
  $('.menu').click(function () {
    $('.lt-aside').toggleClass('lt-out');
    $('body, .lt-top').toggleClass('pl-180');
  })

  // 4- 退出功能 
  // 退出的原理：
  // 删除用户在服务器中登陆过标记即可；
  // 为什么要登录？
  //   登陆成功用户，会在服务器生成一个登陆成功标记， 这个标记就是服务器判断是否返回资源条件； 

  // 退出代码实现： 
  // 我们通过ajax先后台发送一个请求，请求后台删除用户登陆标记即可；  
  $('.logout').click(function () {
    $.ajax({
      type: 'get',
      url: '/employee/employeeLogout',
      cache: false,
      dataType: 'json',
      success: function (res) {
        console.log(res);
        // 在服务器删除标记成功后，跳转到登陆页       
        location.href = './login.html';

      }
    })
  })


})